<template>
  <HView class="navs">
    <HHeader class="header border-bottom-line">
      <div slot="left" class="hips-header-btn" @click="goBack">
        <i class="allow-left-icon"/>
      </div>
      <div slot="center">{{ $route.meta.name }}</div>
    </HHeader>

    <HContent class="content">
      <router-view/>
    </HContent>
  </HView>
</template>

<script>
import { HView, HHeader, HContent } from '&'

export default {
  components: {
    HView,
    HHeader,
    HContent,
  },
  data () {
    return {}
  },
  async mounted () {},
  methods: {
    goBack () {
      this.$router.back()
    },
  },
}
</script>

<style lang="stylus">
@import '../../assets/stylus/import.styl';

.navs {
  .allow-left-icon {
    border: solid 2px $baseColor;
    border-bottom-width: 0;
    border-left-width: 0;
    width: 12px;
    height: 12px;
    transform: rotate(-135deg);
  }
  .content-view {
    padding-bottom: 45px;
    .item-title {
      font-size: 14px;
      padding: 0 15px;
      padding-top: 25px;
      color: #6D7A80;
    }
  }
}
</style>
